<template>
    <div>
        <select @change="choseValue($event)">
            <option v-for="(item, index) in data" :key="index" :value="item.value">{{item.name}}</option>
        </select>
        <div style="width: 100px;">
            <Select @on-change="choseValue2">
                <Option v-for="(item, index) in data" :value="item.value" :key="index">{{ item.name }}</Option>
            </Select>
        </div>
    </div>
</template>

<script>
    export default {
        name: "MySelect2",
        props: {
            data: Array
        },
        data () {
            return {
                selectShow: false,
                value: '',
            }
        },
        methods: {
            choseValue (e) {
                this.value = e.target.value;
                // 触发的事件
                window.console.log(e);
                // 选择项的index索引
                window.console.log(e.target.selectedIndex);
                // 选择项的value
                window.console.log(e.target.value);
                this.$emit('selectFunc', e.target.value);
            },
            choseValue2 (value) {
                window.console.log(777, value);
                this.$emit('selectFunc', value);
            }
        }
    }
</script>

<style scoped>

</style>